<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
</head>

<body>

<h1>销售统计</h1>

<table id="demo" lay-filter="test"></table>

<div id="selectDiv">
    <div id="select">查询销售统计信息</div>

    <input type="text" name="username" id="names">厂商<br>
    <input type="text" name="startTime" id="startTime">起始编号<br>
    <input type="text" name="endTime" id="endTime">结束编号<br>
    <input type="button" value="提交" id="btn"> <br>
</div>

</body>
<script src="../layui/layui.js"></script>
<script>
    layui.use(['table','jquery'], function(){
        var table = layui.table;
        var $=layui.$;

        //第一个实例
        table.render({
            id:"tableTest"
            ,elem: '#demo'
            ,url: '/cargo/getLike' //数据接口
            ,page:true
            ,limit:5
            ,cols: [[ //表头
                {field: 'cargoId', title: 'ID', width:80, sort: true, fixed: 'left'}
                ,{field: 'cargoVender', title: '厂商'}
                ,{field: 'cargoType', title: '类别'}
                ,{field: 'buyrecordNumber', title: '销售数量'}
            ]]
        });

        $("#btn").on("click",function (){
            table.reload('tableTest',{
                url: '/cargo/getLike'
                ,when:{'name':$('#names').val(),
                'startTime':$('#startTime').val(),
                'endTime':$('#endTime').val()}
            });
        });
    });

</script>

</html>